<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>需求大厅</title>
		<link rel="stylesheet" type="text/css" href="../css/foot_style.css"/>
		<link rel="stylesheet" type="text/css" href="../css/head_style.css"/>
		<link rel="stylesheet" href="../js/layui-v2.2.6/layui/css/layui.css">
		<link rel="stylesheet" type="text/css" href="../css/fontCss.css"/>
		<link rel="stylesheet" type="text/css" href="../css/demandHall.css"/>
		 <script src="../js/layui-v2.2.6/layui/layui.js"></script>
	</head>
	<body>
		<!--头部-->
		<div class="head">
			<div class="head1 ">
				<img class="img" src="../img/top1.png" alt="汇网" width="50" height="50"/>
				<div class="head-search layui-form">
					<i class="layui-icon layui-icon-face-smile search-icon">&#xe615;</i> 
				 <div class="layui-input-inline head-search-input">
			        <select name="modules" lay-verify="required" lay-search="">
			          <option value="">寻找人才</option>
			          <option value="1">人才1号</option>
			        </select>
			     </div>
				</div>
				
				<div class="layui-btn layui-btn-sm fabu-btn">发&nbsp;&nbsp;布</div>
				<div class="btns">
					<span class="language-btns" >
						中文
						<i class="layui-icon layui-icon-face-smile language-icon">&#xe61a;</i>
					&nbsp;&nbsp;&nbsp;
						<div class="span-div">
							<p class="cn">中文</p>
								<hr/>
								<p class="eng">English</p>
						</div>
					</span>
					<span>&nbsp;&nbsp;&nbsp;</span>
					<div class="img-userhead">
						<img src="../img/1/10.png"/ width="32" height="32" style="border-radius: 16px;;"><!--头像-->
						<!--<span class="login-btn">登录</span>
						<span>&nbsp;&nbsp;&nbsp;|&nbsp;&nbsp;&nbsp;</span>
						<span class="register-btn">注册</span>-->
						<span class="user-btn">Manty
							<i class="layui-icon layui-icon-face-smile user-icon" style="font-size: 14px;">&#xe61a;</i>
						</span>
						<div class="userbox">
							<div class="userbox-user">
								<img src="../img/1/10.png"/ >
								<span class="userbox-usename">Manty</span>
								<span class="userbox-usertype">个人用户</span>
							</div>
							<div class="userbox-set">
								<i class="iconfont " style="font-size: 14px;color: #333333;">&#xe606;</i>
								&nbsp;&nbsp;&nbsp;设置
							</div>
							<div class="userbox-out">
								<i class="iconfont " style="font-size: 14px;color: #333333;">&#xe652;</i>
								&nbsp;&nbsp;&nbsp;安全退出
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
		<!--导航-->
		<div class="nav">
			<div class="nav1">
				<ul>
					<li>首&nbsp;&nbsp;&nbsp;&nbsp;页</li>
					<li>供需大厅</li>
					<li>产品说明</li>
					<li>关于我们</li>
					<li>帮助中心</li>
				</ul>
			</div>
		</div>
	
		<div class="content">
			<div class="contentBox">
				<div class="contentBox-choose">
					<ul class="contentBox-choose1">
						<li class="li-1">供需大厅</li>
						<li>所有</li>
						<li>个人</li>
						<li>公司</li>
					</ul>
					<br />
					<ul class="contentBox-choose1">
						<li class="li-1">服务提供</li>
						<li >全部</li>
						<li>个人服务</li>
						<li>公司服务</li>
					</ul>
					<br />
					<ul class="contentBox-choose1">
						<li class="li-1">需求寻找</li>
						<li>全部</li>
						<li>个人需求</li>
						<li>公司服务</li>
					</ul>
				</div>
				<div class="contentBox-body">
					<div  id="contentBox-body-list1" >
					  	<div carousel-item >
					  	<!--个人第一页-->
					    <div class="carousel-item">
					    	<div class="list-style">
					    		<div class="list-style-title" >
					    			个人需求
					    			<img class="list-style-title-img1" src="../img/demandHall1.png"/>
					    			<div class="list-style-title-img2">
					    				<img src="../img/demandHall2.png"/>
					    			</div>
					    		</div>
					    		<div class="list-style-headImg">
					    			<img src="../img/demandHall3.png"/>
					    		</div>
					    		<div class="list-style-name">
					    			张大大
					    		</div>
					    		<div class="list-style-explain">
					    			我要找国际人才或资源
					    		</div>
					    		<div class="list-style-place">
					    			现所在地
					    			<span class="list-style-place-span">湖南&nbsp;&nbsp;&nbsp;长沙</span>
					    			<div class="list-style-place-img">
					    				<img src="../img/demandHall2.png"/>
					    			</div>
					    		</div>
					    		<div class="list-style-specialty">
					    			<div class="specialty-label-box">
					    				<div class="specialty-label specialty-label-style">
					    				钢琴
						    			</div>
						    			<div class="specialty-label specialty-label-style" style="margin-left: 15px;">
						    				LOGO设计萨达萨达所
						    			</div>
						    			
					    			</div>
					    			
					    		</div>
					    		<div class="list-style-PerTitle">
					    			我提供服务产品设计服务，这个我提供服务产品设计服务，这个我提供服务产品设计服务，这个
					    		</div>
					    		<div class="list-style-PerContent">
					    			几乎每一个人对"服务"一词都不会陌生，但如果要回答"什么是服务"，相信没有几个人能说得清楚。 " 服务"也和"管理"一样，很多
					    		</div>
					    		<div class="list-style-details">
					    			查看详情
					    		</div>
					    		<div class="list-style-viewtime">
					    			<i class="iconfont i-view" > &#xe60d;</i>
					    			<span class="span-view">13021</span>
					    			<i class="iconfont i-times">&#xe75f;</i>
					    			<span class="span-times">2018-03-31 23:59:59</span>
					    		</div>
					    	</div>
					    	<div class="list-style">
					    		<div class="list-style-title">
					    			个人需求
					    			<img class="list-style-title-img1" src="../img/demandHall1.png"/>
					    			<div class="list-style-title-img2">
					    				<img src="../img/demandHall2.png"/>
					    			</div>
					    		</div>
					    		<div class="list-style-headImg">
					    			<img src="../img/demandHall3.png"/>
					    		</div>
					    		<div class="list-style-name">
					    			张大大
					    		</div>
					    		<div class="list-style-explain">
					    			我要找国际人才或资源
					    		</div>
					    		<div class="list-style-place">
					    			现所在地
					    			<span class="list-style-place-span">湖南&nbsp;&nbsp;&nbsp;长沙</span>
					    			<div class="list-style-place-img">
					    				<img src="../img/demandHall2.png"/>
					    			</div>
					    		</div>
					    		<div class="list-style-specialty">
					    			<div class="specialty-label-box">
						    			<div class="specialty-label specialty-label-style">
						    				钢琴
						    			</div>
						    			<div class="specialty-label specialty-label-style" style="margin-left: 15px;">
						    				LOGO设计
						    			</div>
					    			</div>
					    		</div>
					    		<div class="list-style-PerTitle">
					    			我提供服务产品设计服务，这个……
					    		</div>
					    		<div class="list-style-PerContent">
					    			几乎每一个人对"服务"一词都不会陌生，但如果要回答"什么是服务"，相信没有几个人能说得清楚。 " 服务"也和"管理"一样，很多
					    			几乎每一个人对"服务"一词都不会陌生，但如果要回答"什么是服务"，相信没有几个人能说得清楚。 " 服务"也和"管理"一样，很多
					    		</div>
					    		<div class="list-style-details">
					    			查看详情
					    		</div>
					    		<div class="list-style-viewtime">
					    			<i class="iconfont i-view" > &#xe60d;</i>
					    			<span class="span-view">13021</span>
					    			<i class="iconfont i-times">&#xe75f;</i>
					    			<span class="span-times">2018-03-31 23:59:59</span>
					    		</div>
					    	</div>
					    	<div class="list-style">
					    		<div class="list-style-title">
					    			个人需求
					    			<img class="list-style-title-img1" src="../img/demandHall1.png"/>
					    			<div class="list-style-title-img2">
					    				<img src="../img/demandHall2.png"/>
					    			</div>
					    		</div>
					    		<div class="list-style-headImg">
					    			<img src="../img/demandHall3.png"/>
					    		</div>
					    		<div class="list-style-name">
					    			张大大
					    		</div>
					    		<div class="list-style-explain">
					    			我要找国际人才或资源
					    		</div>
					    		<div class="list-style-place">
					    			现所在地
					    			<span class="list-style-place-span">湖南&nbsp;&nbsp;&nbsp;长沙</span>
					    			<div class="list-style-place-img">
					    				<img src="../img/demandHall2.png"/>
					    			</div>
					    		</div>
					    		<div class="list-style-specialty">
					    			<div class="specialty-label-box">
						    			<div class="specialty-label specialty-label-style">
						    				钢琴
						    			</div>
						    			<div class="specialty-label specialty-label-style" style="margin-left: 15px;">
						    				LOGO设计
						    			</div>
					    			</div>
					    		</div>
					    		<div class="list-style-PerTitle">
					    			我提供服务产品设计服务，这个……
					    		</div>
					    		<div class="list-style-PerContent">
					    			几乎每一个人对"服务"一词都不会陌生，但如果要回答"什么是服务"，相信没有几个人能说得清楚。 " 服务"也和"管理"一样，很多
					    		</div>
					    		<div class="list-style-details">
					    			查看详情
					    		</div>
					    		<div class="list-style-viewtime">
					    			<i class="iconfont i-view" > &#xe60d;</i>
					    			<span class="span-view">13021</span>
					    			<i class="iconfont i-times">&#xe75f;</i>
					    			<span class="span-times">2018-03-31 23:59:59</span>
					    		</div>
					    	</div>
					    	<div class="list-style">
					    		<div class="list-style-title">
					    			个人需求
					    			<img class="list-style-title-img1" src="../img/demandHall1.png"/>
					    			<div class="list-style-title-img2">
					    				<img src="../img/demandHall2.png"/>
					    			</div>
					    		</div>
					    		<div class="list-style-headImg">
					    			<img src="../img/demandHall3.png"/>
					    		</div>
					    		<div class="list-style-name">
					    			张大大
					    		</div>
					    		<div class="list-style-explain">
					    			我要找国际人才或资源
					    		</div>
					    		<div class="list-style-place">
					    			现所在地
					    			<span class="list-style-place-span">湖南&nbsp;&nbsp;&nbsp;长沙</span>
					    			<div class="list-style-place-img">
					    				<img src="../img/demandHall2.png"/>
					    			</div>
					    		</div>
					    		<div class="list-style-specialty">
					    			<div class="specialty-label-box">
						    			<div class="specialty-label specialty-label-style">
						    				钢琴
						    			</div>
						    			<div class="specialty-label specialty-label-style" style="margin-left: 15px;">
						    				LOGO设计
						    			</div>
					    			</div>
					    		</div>
					    		<div class="list-style-PerTitle">
					    			我提供服务产品设计服务，这个……
					    		</div>
					    		<div class="list-style-PerContent">
					    			几乎每一个人对"服务"一词都不会陌生，但如果要回答"什么是服务"，相信没有几个人能说得清楚。 " 服务"也和"管理"一样，很多
					    		</div>
					    		<div class="list-style-details">
					    			查看详情
					    		</div>
					    		<div class="list-style-viewtime">
					    			<i class="iconfont i-view" > &#xe60d;</i>
					    			<span class="span-view">13021</span>
					    			<i class="iconfont i-times">&#xe75f;</i>
					    			<span class="span-times">2018-03-31 23:59:59</span>
					    		</div>
					    	</div>
					    </div>
					    
					    <div class="leftbtn">
				  			<i class="iconfont">&#xe68a;</i>
						</div>
						<div class="rightbtn">
				  			<i class="iconfont">&#xe6c6;</i>
						</div>
					</div>
					
					</div>
					<div  id="contentBox-body-list2" >
						
					  	<div carousel-item >
					    	<div class="carousel-item" >
					    	<div class="list-style" >
					    		<div class="list-style-1" >
					    			公司需求
					    			<img class="list-style-1-img1" src="../img/demandHall1.png"/>
					    			<div class="list-style-1-img2">
					    				<img src="../img/demandHall2.png"/>
					    			</div>
					    		</div>
					    		<div class="list-style-headImg">
					    			<img src="../img/demandHall3.png"/>
					    		</div>
					    		<div class="list-style-name">
					    			某某某有限公司
					    		</div>
					    		<div class="list-style-explain">
					    			我要找国际人才或资源
					    		</div>
					    		<div class="list-style-place">
					    			现所在地
					    			<span class="list-style-place-span">湖南&nbsp;&nbsp;&nbsp;长沙</span>
					    			<div class="list-style-place-img">
					    				<img src="../img/demandHall2.png"/>
					    			</div>
					    		</div>
					    		<div class="list-style-specialty">
					    			<div class="specialty-label-box">
						    			<div class="specialty-label specialty-label-style">
						    				钢琴
						    			</div>
						    			<div class="specialty-label specialty-label-style" style="margin-left: 15px;">
						    				LOGO设计
						    			</div>
					    			</div>
					    		</div>
					    		<div class="list-style-PerTitle">
					    			我提供服务产品设计服务，这个……
					    		</div>
					    		<div class="list-style-PerContent">
					    			几乎每一个人对"服务"一词都不会陌生，但如果要回答"什么是服务"，相信没有几个人能说得清楚。 " 服务"也和"管理"一样，很多
					    			几乎每一个人对"服务"一词都不会陌生，但如果要回答"什么是服务"，相信没有几个人能说得清楚。 " 服务"也和"管理"一样，很多
					    			几乎每一个人对"服务"一词都不会陌生，但如果要回答"什么是服务"，相信没有几个人能说得清楚。 " 服务"也和"管理"一样，很多
					    			几乎每一个人对"服务"一词都不会陌生，但如果要回答"什么是服务"，相信没有几个人能说得清楚。 " 服务"也和"管理"一样，很多
					    		</div>
					    		<div class="list-style-details">
					    			查看详情
					    		</div>
					    		<div class="list-style-viewtime">
					    			<i class="iconfont i-view" > &#xe60d;</i>
					    			<span class="span-view">13021</span>
					    			<i class="iconfont i-times">&#xe75f;</i>
					    			<span class="span-times">2018-03-31 23:59:59</span>
					    		</div>
					    	</div>
					    	<div class="list-style">
					    		<div class="list-style-1">
					    			公司需求
					    			<img class="list-style-1-img1" src="../img/demandHall1.png"/>
					    			<div class="list-style-1-img2">
					    				<img src="../img/demandHall2.png"/>
					    			</div>
					    		</div>
					    		<div class="list-style-headImg">
					    			<img src="../img/demandHall3.png"/>
					    		</div>
					    		<div class="list-style-name">
					    			某某某有限公司
					    		</div>
					    		<div class="list-style-explain">
					    			我要找国际人才或资源
					    		</div>
					    		<div class="list-style-place">
					    			现所在地
					    			<span class="list-style-place-span">湖南&nbsp;&nbsp;&nbsp;长沙</span>
					    			<div class="list-style-place-img">
					    				<img src="../img/demandHall2.png"/>
					    			</div>
					    		</div>
					    		<div class="list-style-specialty">
					    			<div class="specialty-label-box">
						    			<div class="specialty-label specialty-label-style">
						    				钢琴
						    			</div>
						    			<div class="specialty-label specialty-label-style" style="margin-left: 15px;">
						    				LOGO设计
						    			</div>
					    			</div>
					    		</div>
					    		<div class="list-style-PerTitle">
					    			我提供服务产品设计服务，这个……
					    		</div>
					    		<div class="list-style-PerContent">
					    			几乎每一个人对"服务"一词都不会陌生，但如果要回答"什么是服务"，相信没有几个人能说得清楚。 " 服务"也和"管理"一样，很多
					    		</div>
					    		<div class="list-style-details">
					    			查看详情
					    		</div>
					    		<div class="list-style-viewtime">
					    			<i class="iconfont i-view" > &#xe60d;</i>
					    			<span class="span-view">13021</span>
					    			<i class="iconfont i-times">&#xe75f;</i>
					    			<span class="span-times">2018-03-31 23:59:59</span>
					    		</div>
					    	</div>
					    	<div class="list-style">
					    		<div class="list-style-1">
					    			公司需求
					    			<img class="list-style-1-img1" src="../img/demandHall1.png"/>
					    			<div class="list-style-1-img2">
					    				<img src="../img/demandHall2.png"/>
					    			</div>
					    		</div>
					    		<div class="list-style-headImg">
					    			<img src="../img/demandHall3.png"/>
					    		</div>
					    		<div class="list-style-name">
					    			某某某有限公司
					    		</div>
					    		<div class="list-style-explain">
					    			我要找国际人才或资源
					    		</div>
					    		<div class="list-style-place">
					    			现所在地
					    			<span class="list-style-place-span">湖南&nbsp;&nbsp;&nbsp;长沙</span>
					    			<div class="list-style-place-img">
					    				<img src="../img/demandHall2.png"/>
					    			</div>
					    		</div>
					    		<div class="list-style-specialty">
					    			<div class="specialty-label-box">
						    			<div class="specialty-label specialty-label-style">
						    				钢琴
						    			</div>
						    			<div class="specialty-label specialty-label-style" style="margin-left: 15px;">
						    				LOGO设计
						    			</div>
					    			</div>
					    		</div>
					    		<div class="list-style-PerTitle">
					    			我提供服务产品设计服务，这个……
					    		</div>
					    		<div class="list-style-PerContent">
					    			几乎每一个人对"服务"一词都不会陌生，但如果要回答"什么是服务"，相信没有几个人能说得清楚。 " 服务"也和"管理"一样，很多
					    		</div>
					    		<div class="list-style-details">
					    			查看详情
					    		</div>
					    		<div class="list-style-viewtime">
					    			<i class="iconfont i-view" > &#xe60d;</i>
					    			<span class="span-view">13021</span>
					    			<i class="iconfont i-times">&#xe75f;</i>
					    			<span class="span-times">2018-03-31 23:59:59</span>
					    		</div>
					    	</div>
					    	<div class="list-style">
					    		<div class="list-style-1">
					    			公司需求
					    			<img class="list-style-1-img1" src="../img/demandHall1.png"/>
					    			<div class="list-style-1-img2">
					    				<img src="../img/demandHall2.png"/>
					    			</div>
					    		</div>
					    		<div class="list-style-headImg">
					    			<img src="../img/demandHall3.png"/>
					    		</div>
					    		<div class="list-style-name">
					    			某某某有限公司
					    		</div>
					    		<div class="list-style-explain">
					    			我要找国际人才或资源
					    		</div>
					    		<div class="list-style-place">
					    			现所在地
					    			<span class="list-style-place-span">湖南&nbsp;&nbsp;&nbsp;长沙</span>
					    			<div class="list-style-place-img">
					    				<img src="../img/demandHall2.png"/>
					    			</div>
					    		</div>
					    		<div class="list-style-specialty">
					    			<div class="specialty-label-box">
						    			<div class="specialty-label specialty-label-style">
						    				钢琴
						    			</div>
						    			<div class="specialty-label specialty-label-style" style="margin-left: 15px;">
						    				LOGO设计
						    			</div>
					    			</div>
					    		</div>
					    		<div class="list-style-PerTitle">
					    			我提供服务产品设计服务，这个……
					    		</div>
					    		<div class="list-style-PerContent">
					    			几乎每一个人对"服务"一词都不会陌生，但如果要回答"什么是服务"，相信没有几个人能说得清楚。 " 服务"也和"管理"一样，很多
					    		</div>
					    		<div class="list-style-details">
					    			查看详情
					    		</div>
					    		<div class="list-style-viewtime">
					    			<i class="iconfont i-view" > &#xe60d;</i>
					    			<span class="span-view">13021</span>
					    			<i class="iconfont i-times">&#xe75f;</i>
					    			<span class="span-times">2018-03-31 23:59:59</span>
					    		</div>
					    	</div>
					    </div>
					    
					  </div>
					  
						<div class="leftbtn">
				  			<i class="iconfont">&#xe68a;</i>
						</div>
						<div class="rightbtn">
				  			<i class="iconfont">&#xe6c6;</i>
						</div>
					</div>
				
				</div>
			
			</div>
		</div>
		<div class="foot" >
			<div class="foot1">
				Copyright © 2018 世界汇网  www.thewiorldwie.cn
			</div>
		</div>
	</body>
	<script>
	layui.use(['form', 'layedit', 'laydate','carousel'], function(){
	  var form = layui.form
	  ,layer = layui.layer
	  ,layedit = layui.layedit
	  ,laydate = layui.laydate
	  ,carousel = layui.carousel
	  ,$ = layui.jquery;
		
		 $(".language-btns").click(function(){
                if(!$(".span-div").is(':hidden')){//如果当前不隐藏
                    $('.span-div').hide();//就隐藏div
                    $(".language-icon").html("&#xe61a;")
                }else{//否则
					$('.userbox').hide();//就隐藏div
					$(".user-icon").html("&#xe61a;")
                    $('.span-div').show();//那么就显示div
                    $(".language-icon").html("&#xe619;")
                }
            })

            $(".user-btn").click(function(){
                if(!$(".userbox").is(':hidden')){//如果当前不隐藏
                    $('.userbox').hide();//就隐藏div
                    $(".user-icon").html("&#xe61a;")
                }else{//否则
 					$('.span-div').hide();//就隐藏div
 					$(".language-icon").html("&#xe61a;")
                    $('.userbox').show();//那么就显示div
                    $(".user-icon").html("&#xe619;")
                }
            });
		
//		//建造实例
//		  carousel.render({
//		    elem: '#contentBox-body-list1'
//		    ,width: '1077px' //设置容器宽度
//		    ,height: " 604px" //高度
//		    ,arrow: 'always' //始终显示箭头
//		    //,anim: 'updown' //切换动画方式
//		    ,autoplay: false
//		    ,indicator:"none"
//		  });
//		  carousel.render({
//		    elem: '#contentBox-body-list2'
//		    ,width: '1077px' //设置容器宽度
//		    ,height: " 604px" //高度
//		    ,arrow: 'always' //始终显示箭头
//		    //,anim: 'updown' //切换动画方式
//		    ,autoplay: false
//		    ,indicator:"none"
//		  });
		  
//		carousel.on('change(contentBox-body-list1)', function(obj){ 
////			  console.log(obj.index); //当前条目的索引
////			  console.log(obj.prevIndex); //上一个条目的索引
////			  console.log(obj.item); //当前条目的元素对象
//			  if(obj.index==0){
//			  	$("#contentBox-body-list1 button").eq(0).hide()
//			  }else{
//			  	$("#contentBox-body-list1 button").eq(0).show()
//			  }
//			  
//			
//			  if(obj.index==$("#contentBox-body-list1 .carousel-item").length-1){
//			  	$("#contentBox-body-list1 button").eq(1).hide()
//			  }else{
//			  	$("#contentBox-body-list1 button").eq(1).show()
//			  }
//		}); 
//		
//		carousel.on('change(contentBox-body-list2)', function(obj){ 
////			  console.log(obj.index); //当前条目的索引
////			  console.log(obj.prevIndex); //上一个条目的索引
////			  console.log(obj.item); //当前条目的元素对象
//			  if(obj.index==0){
//			  	$("#contentBox-body-list2 button").eq(0).hide()
//			  }else{
//			  	$("#contentBox-body-list2 button").eq(0).show()
//			  }
//			  
//			
//			  if(obj.index==$("#contentBox-body-list2 .carousel-item").length-1){
//			  	$("#contentBox-body-list2 button").eq(1).hide()
//			  }else{
//			  	$("#contentBox-body-list2 button").eq(1).show()
//			  }
//		}); 
		
})
  	</script>
</html>
